import { defineComponent, onUnmounted, reactive } from 'vue'
import Draw from './draw'

export default defineComponent({
  components: {
    Draw,
  },
  setup() {
    let intervalInstance = null
    const cdata = reactive({
      xLabel: ['07/11', '07/12', '07/13', '07/14', '07/15', '07/16', '07/17', '07/18', '07/19', '07/20', '07/21', '07/22'],
      goToSchool: [643, 678, 644, 615, 636, 687, 622, 633, 615, 605, 596, 655],
      goOutSchool: [343, 378, 344, 315, 336, 387, 322, 333, 315, 305, 396, 355],
      goOutSchool2: [143, 178, 144, 115, 136, 187, 122, 133, 115, 105, 196, 155],
      index:0
    })
    intervalInstance = setInterval(() => {
      cdata.index += 1
    }, 2000)

    onUnmounted(() => {
      clearInterval(intervalInstance)
    })
    return () => {
      return (
        <div>
          <Draw cdata={cdata} />
        </div>
      )
    }
  },
})
